<template>
	<view>
		<view class="container" v-if="shopList.length!==0">
			<view class="title">
				我的销售商
			</view>
			<view class="content">
				<view class="shop-item u-flex u-row-between u-col-center" v-for="item in shopList" :key="item.id">
					<view class="u-flex u-col-center">
						<image :src="item.logoUrl?item.logoUrl:defaultLogo" mode="" class="shop-logo"></image>
						<text class="shop-name u-m-l-20">{{item.name}}</text>
					</view>
					<view class="go-shop" @click="toShopHome(item.id)">进店</view>
				</view>
			</view>
		</view>
		<view class="container" v-if="sellShopList.length!==0">
			<view class="title">
				推荐销售商
			</view>
			<view class="content">
				<view class="shop-item u-flex u-row-between u-col-center" v-for="item in sellShopList" :key="item.shopId">
					<view class="u-flex u-col-center u-flex-1">
						<image :src="item.logoUrl?item.logoUrl:defaultLogo" mode="" class="shop-logo"></image>
						<text class="shop-name u-m-l-20 u-flex-1">{{item.shopName}}</text>
					</view>
					<view class="go-shop" @click="toSignContract(item.shopId)">签约</view>
				</view>
			</view>
		</view>
	</view>
	
</template>

<script>
	export default{
		data(){
			return {
				shopList:[],
				sellShopList:[]
			}
		},
		props:{
			shopId:''
		},
		created() {
			this.getShopList();
		},
		methods:{
			toShopHome(id){
				this.$mRouter.push({ route: '/pages/sale/homePage/index?id='+id });
			},
		  async getShopList(){
			  let params = {
				BuyerId: this.shopId,
				itemMaxCount: 0,
			  }
			  const res = await this.$newHttp.get('api/v1.2/ShanNiang/GetSellers', { params: params } );
			  if(res.code === 200){
				  this.shopList = res.data;
				  if(res.data.length===0){
					  await this.getSellShopList();
				  }else{
					  this.sellShopList = [];
				  }
			  }
		  },
		  async getSellShopList(){
			  let params = {
					pageIndex:1,
					pageSize:999
			  }
			  const res = await this.$newHttp.get('api/v1.2/Shop/BuyerGetRecommendSellersByPage', { params: params } );
			  if(res.code === 200){
					this.sellShopList = res.data.list;
			  }
		  },
		  toSignContract(id){
			  this.$mRouter.push({ route: '/pages/purchase/mySale/signContract?type=sell&id='+id });
		  },
		}
	}
</script>

<style lang="scss" scoped>
	.container{
		background: #FFFFFF;
		box-shadow: 0px 0px 18px 2px rgba(8,1,3,0.1);
		border-radius: 10px;
		position: relative;
		margin-top:30rpx;
		.title{
			background: url('/static/home/mark.png') no-repeat;
			background-size: 100% 100%;
			display: inline-block;
			box-sizing: border-box;
			padding: 16rpx 30rpx;
			
		}
		.content{
			box-sizing: border-box;
			padding: 0rpx 30rpx;
			.shop-item{
				box-sizing: border-box;
				padding: 30rpx 0rpx;
				border-bottom: 1px solid #e5e5e5;
				&:nth-last-of-type(1){
					border: none;
				}
				.shop-logo{
					width: 70rpx;
					height: 70rpx;
					border-radius: 50%;
				}
				.shop-name{
					color: #333;
					font-size: 28rpx;
				} 
				.go-shop{
					box-sizing: border-box;
					padding: 14rpx 30rpx;
					border-radius: 25rpx;
					font-size: 24rpx;
					background-color: #ffbb1a;
				}
			}
		}
	}
</style>